/**
*  重新编制手册程序修订
 */
<template>
    <div class="layout-parent w100 p10">
        <el-tabs type="border-card">
            <el-tab-pane :label="$t('tabs.basicInfo')">
                <template #label><vp-label zh="基本信息" en="Basic Info"/></template>
                <QualityManual :id="businessId"  type="reedit" :nwbsDisabled="true" ref="manualRef" @formSubmited="getData" ></QualityManual>
            </el-tab-pane>
            <el-tab-pane v-if="formData.processid" :label="$t('tabs.processRecord')">
                <template #label><vp-label zh="流程记录" en="Process Record"/></template>
                <ProcessHistory :processInsId="formData.processid" />
            </el-tab-pane>
            <el-tab-pane v-if="formData.processid" :label="$t('tabs.processChart')">
                <template #label><vp-label zh="流程图" en="Process Chart"/></template>
                <ProcessView :processInsId="formData.processid"/>
            </el-tab-pane>
            <el-tab-pane :label="$t('tabs.operationRecord')">
                <template #label><vp-label zh="操作记录" en="Operation Record"/></template>
                <VpOperationRecordCard :id="formData.id" ref="rcListRef"></VpOperationRecordCard>
            </el-tab-pane>
        </el-tabs>
        <StatusBar :id="formData.id" :status="formData.zt" :isValid="1" />
        <PageBottom>
            <vp-btn-save :loading="saveLoading" @click="handleSubmit"/>
            <VpProcessToolBar 
                :process-ins-id="processInsId" 
                :task-id="taskId" 
                :loading="saveLoading" 
                :set-loading-fn="(_loading: boolean) => { saveLoading = _loading }"
                :before-show-fn="beforeShowFn" 
                :after-agree-fn="afterAgreeFn"
                :after-cancel-fn="afterCancelFn"
                :show-cancel="true"
                :show-reject="false"
            />
        </PageBottom>
    </div>
</template>

<script lang="ts" setup name="reeditQualityManualRevision">
import { defineAsyncComponent, defineExpose, getCurrentInstance, ref } from 'vue';
import VpOperationRecordCard from '/@/components/vp/operationRecord/VpOperationRecordCard.vue';
import ProcessHistory from '/@/components/vp/workflow/ProcessHistory.vue';
import ProcessView from '/@/components/vp/workflow/ProcessView.vue';
import PageBottom from '/@/components/vp/PageBottom/index.vue';
import request from '/@/utils/request';
import { ElMessage } from "element-plus";
import { useRoute } from 'vue-router';
import mittBus from '/@/utils/mitt';
import StatusBar from '/@/components/vp/status/StatusBar.vue';
import VpProcessToolBar from '/@/components/vp/workflow/VpProcessToolBar.vue';

const QualityManual = defineAsyncComponent(() => import('./QualityManual.vue'));
const ProcessHandle = defineAsyncComponent(() => import('/@/components/vp/workflow/VpProcessHandle.vue'));

const emits = defineEmits<{
    (e: 'formSubmited'): void
}>();

const props= defineProps<{ 
    processInsId: String,
    taskId:String,
    businessId: String,
}>();

const manualRef = ref();

const formData = ref({
      id:"",
      processid: "",
  });

  const getData = (data: any) => {
      formData.value = data;
    };

    const saveLoading = ref(false);

   const processHandleRef = ref();
   const processExtFormRef = ref();
   const route = useRoute();

    const handleSubmit = () =>{
        if(saveLoading.value){
            return;
        }
        saveLoading.value = true;
            manualRef.value.getData(10).then((data: any) =>{
            request
                .post("/quality/manual/reeditsave", {
                ...data,
                processHandle: {
                    processInsId: props.processInsId,
                    taskId: props.taskId,
                },
                })
                .then(() => {
                    mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
                    ElMessage.success("办理完毕/Completed Processing");
                })
                .catch(() => {})
                .finally(() => {
                saveLoading.value = false;
                });
        }).catch(()=>{saveLoading.value = false;});
    }

//同意前操作
const beforeShowFn = () => {
    saveLoading.value = true;
    return manualRef.value.getData(88).finally(()=>{saveLoading.value = false;});
}
//同意后操作
const afterAgreeFn = (processHandle: any) => { 
    saveLoading.value = true;
    manualRef.value.getData(88).then((data: any) =>{
        request.post('/quality/manual/reedit', {
            ...data,
            processHandle: {
                processInsId: props.processInsId,
                taskId: props.taskId,
                ...processHandle,
            }
        }).then(()=>{
            mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
            ElMessage.success("办理完毕/Completed Processing");
        }).catch(()=>{
        }).finally(()=>{
            saveLoading.value = false;
        })
    }).catch(()=>{saveLoading.value = false;});
}

const afterCancelFn = (processHandle: any) => { 
    saveLoading.value = true;
    request.post('/quality/manual/reedit', {
        id: props.businessId,
        processHandle: processHandle,
    }).then(()=>{
        mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
        ElMessage.success("办理完毕/Completed Processing");
    }).catch(()=>{
    }).finally(()=>{
        saveLoading.value = false;
    })
}

defineExpose({
})
</script>
<style scoped lang="scss">

</style>
